// 模拟飞行路线模块地图模块
(function() {
    var myChart = echarts.init(document.querySelector(".left_map"));
    var GeoCoordMap = {
        // '中国': [100.501765, 30.756331],
        '中国': [117.285, 31.8584], // 合肥
        '美国': [-95.712891, 37.09024],
        '加拿大': [-106.346771, 56.130366],
        '墨西哥': [-102.552784, 23.634501],
        '英国': [-3.435973, 55.378051],
        '德国': [10.451526, 51.165691],
        '法国': [2.213749, 46.227638],
        '意大利': [12.56738, 41.87194],
        '西班牙': [-3.74922, 40.463667],
        '印度': [78.96288, 20.593684],
        '阿联酋': [53.847818, 23.424076],
        '沙特阿拉伯': [45.079162, 23.885942],
        '日本': [138.252924, 36.204824],
        '澳大利亚': [133.775136, -25.274398]
    };
    var Datas = [
        [{
            name: '中国',
            value: "",
            price: 100,
            num: 2
        }],
        [{
            name: '美国',
            value: "US:北美站",
            price: 100,
            num: 2
        }],
        [{
            name: '加拿大',
            value: "CA:北美站",
            price: 100,
            num: 2
        }],
        [{
            name: '墨西哥',
            value: "MX:北美站",
            price: 100,
            num: 2
        }],
        [{
            name: '英国',
            value: "UK:欧洲站",
            price: 100,
            num: 2
        }],
        [{
            name: '德国',
            value: "DE:欧洲站",
            price: 100,
            num: 2
        }],
        [{
            name: '法国',
            value: "FR:欧洲站",
            price: 100,
            num: 2
        }],
        [{
            name: '意大利',
            value: "IT:欧洲站",
            price: 100,
            num: 2
        }],
        [{
            name: '西班牙',
            value: "ES:欧洲站",
            price: 100,
            num: 2
        }],
        [{
            name: '印度',
            value: "IN:欧洲站",
            price: 100,
            num: 2
        }],
        [{
            name: '阿联酋',
            value: "AE:欧洲站",
            price: 100,
            num: 2
        }],
        [{
            name: '沙特阿拉伯',
            value: "SA:欧洲站",
            price: 100,
            num: 2
        }],
        [{
            name: '日本',
            value: "JP:日本站",
            price: 100,
            num: 2
        }],
        [{
            name: '澳大利亚',
            value: "AU:澳洲站",
            price: 100,
            num: 2
        }]

    ];
    var convertData = function(data) {
        var res = [];
        for (var i = 0; i < data.length; i++) {
            var dataItem = data[i];
            var fromCoord = [117.285, 31.8584];
            var toCoord = GeoCoordMap[dataItem[0].name];
            if (fromCoord && toCoord) {
                res.push([{
                    coord: fromCoord,
                    value: dataItem[0].value,
                }, {
                    coord: toCoord,
                    dataItem: dataItem
                }]);
            }
        }
        return res;
    };

    var series = [];
    [
        ['中国', Datas]
    ].forEach(function(item, i) {
        series.push(

            {
                type: 'lines',
                zlevel: 0,
                effect: {
                    // 括 'circle', 'rect', 'roundRect', 'triangle', 'diamond', 'pin', 'arrow', 'none'
                    show: true,
                    period: 4, //箭头指向速度，值越小速度越快
                    trailLength: 0.6, //特效尾迹长度[0,1]值越大，尾迹越长重
                    symbol: 'pin', //箭头图标
                    symbolSize: 20, //图标大小
                    color: "#0BE6FB"
                },
                lineStyle: {
                    normal: {
                        width: 1, //尾迹线条宽度
                        opacity: 1, //尾迹线条透明度
                        curveness: 0.5, //尾迹线条曲直度
                        color: function(params) { //圆环显示文字
                            return '#359fd1'
                        },
                    },
                    color: 'red'
                },
                data: convertData(item[1])
            }, {
                type: 'effectScatter',
                coordinateSystem: 'geo',
                zlevel: 2,
                rippleEffect: { //涟漪特效
                    period: 4, //动画时间，值越小速度越快
                    brushType: 'fill', //波纹绘制方式 stroke, fill
                    scale: 6 //波纹圆环最大限制，值越大波纹越大
                },
                // 括 'circle', 'rect', 'roundRect', 'triangle', 'diamond', 'pin', 'arrow', 'none'
                // symbol: 'none',
                symbol: 'circle',
                symbolSize: function(val) {
                    return 8; //圆环大小
                },
                itemStyle: {
                    normal: {
                        show: false,
                        // color: '#f00'
                        color: function(params) { //圆环显示文字
                            return '#ffffff'
                        },
                        borderWidth: 0,
                        shadowColor: '#42FA0A', //发光?效果
                        shadowBlur: 4
                    }
                },
                data: item[1].map(function(dataItem) {
                    // 	console.log('dataItem',dataItem[0]);
                    return {
                        dataItem: dataItem,
                        name: dataItem[0].name,
                        value: GeoCoordMap[dataItem[0].name].concat([dataItem[0].value])
                    };
                }),
            },
            //被攻击点
            {
                type: 'scatter',
                coordinateSystem: 'geo',
                zlevel: 1,
                rippleEffect: {
                    period: 4,
                    brushType: 'stroke',
                    scale: 4
                },
                symbol: 'circle',
                color: 'rgba(128, 220, 251, .6)',
                symbolSize: 20,
                data: [{
                    name: item[0],
                    value: GeoCoordMap[item[0]].concat([""]),
                }],
            }
        );
    });
    var option = {
        // backgroundColor: 'rgba(255, 255, 255, 0)', //rgba设置透明度0.1
        type: 'map',
        mapType: 'world',
        tooltip: {
            formatter: function(e) {
                if (typeof(e.value)[2] == "undefined" || e.name == "") {
                    return e.name;
                } else {
                    return e.name + '<br>' + e.value[2];
                }
            }
        },
        geo: {
            map: 'world',
            zoom: 1.2,
            label: {
                emphasis: {
                    show: true,
                    color: 'white'
                }
            },
            roam: false, //是否允许缩放
            itemStyle: {
                normal: {
                    color: "rgba(53,159,209, 0.1)", //地图背景色
                    borderColor: '#68d9fb', //省市边界线00fcff 516a89
                    borderWidth: 1
                },
                emphasis: {
                    color: 'rgba(104, 217, 251, 127)' //悬浮背景
                },
            },
        },
        series: series
    };
    myChart.setOption(option);
    // 监听浏览器缩放，图表对象调用缩放resize函数
    window.addEventListener("resize", function() {
        myChart.resize();
    });
})();


// 介绍图表
(function() {
    var myChart = echarts.init(document.querySelector(".info_chart"));
    var img = '';
    var trafficWay = [{
        name: '安全',
        value: 25
    }, {
        name: '高效',
        value: 25
    }, {
        name: '全面',
        value: 25
    }, {
        name: '及时',
        value: 25
    }];

    var data = [];
    var color = ['#00ffff', '#00cfff', '#006ced', '#ffe000', '#ffa800', '#ff5b00', '#ff3000']
    for (var i = 0; i < trafficWay.length; i++) {
        data.push({
            value: trafficWay[i].value,
            name: trafficWay[i].name,
            itemStyle: {
                normal: {
                    borderWidth: 5,
                    shadowBlur: 20,
                    borderColor: color[i],
                    shadowColor: color[i]
                }
            }
        }, {
            value: 2,
            name: '',
            itemStyle: {
                normal: {
                    label: {
                        show: false
                    },
                    labelLine: {
                        show: false
                    },
                    color: 'rgba(0, 0, 0, 0)',
                    borderColor: 'rgba(0, 0, 0, 0)',
                    borderWidth: 0
                }
            }
        });
    }
    var seriesOption = [{
        name: '',
        type: 'pie',
        clockWise: false,
        radius: [105, 109],
        hoverAnimation: false,
        itemStyle: {
            normal: {
                label: {
                    show: true,
                    position: 'outside',
                    color: '#ddd',
                    formatter: function(params) {
                        var percent = 0;
                        var total = 0;
                        for (var i = 0; i < trafficWay.length; i++) {
                            total += trafficWay[i].value;
                        }

                        if (params.name == '安全') {
                            return params.name + '\n' + '\n' + '守护您的账号安全';
                        } else if (params.name == '高效') {
                            return params.name + '\n' + '\n' + '自动分析您的店铺数据';
                        } else if (params.name == '全面') {
                            return params.name + '\n' + '\n' + '360度全方位分析';
                        } else if (params.name == '及时') {
                            return params.name + '\n' + '\n' + '快速，准确是我们的使命';
                        } else {
                            return '';
                        }
                    },
                },
                labelLine: {
                    length: 30,
                    length2: 100,
                    show: true,
                    color: '#00ffff'
                }
            }
        },
        data: data
    }];

    var option = {
        // backgroundColor: '#0A2E5D',
        color: color,
        title: {
            text: 'FBA退款',
            top: '48%',
            textAlign: "center",
            left: "49%",
            textStyle: {
                color: '#fff',
                fontSize: 20,
                fontWeight: '400'
            }
        },
        graphic: {
            elements: [{
                type: "image",
                z: 3,
                style: {
                    image: img,
                    width: 178,
                    height: 178
                },
                left: 'center',
                top: 'center',
                position: [100, 100]
            }]
        },
        tooltip: {
            show: false
        },
        // legend: {
        //     icon: "circle",
        //     orient: 'horizontal',
        //     // x: 'left',
        //     data: ['安全', '高效', '全面', '及时'],
        //     right: 250,
        //     bottom: 10,
        //     align: 'right',
        //     textStyle: {
        //         color: "#fff"
        //     },
        //     itemGap: 20
        // },
        toolbox: {
            show: false
        },
        series: seriesOption
    };
    myChart.setOption(option);
    // 监听浏览器缩放，图表对象调用缩放resize函数
    window.addEventListener("resize", function() {
        myChart.resize();
    });


})();

// layui.use(['layer'], function() {
//
//     var layer = layui.layer;
// });
// 更新验证码
function update_captcha() {
    $.getJSON(refursh_captcha_url, function(result) {
        $('#login_captcha').attr('src', result['image_url']);
        $('#reg_captcha').attr('src', result['image_url']);
        $('#captcha_hashkey').val(result['hashkey'])
    });
}


function sign() {
    let sign_form_datas = $('#sign').serializeArray();
    let username = sign_form_datas[0].value.replace(/\s/g, "");
    let password = sign_form_datas[1].value.replace(/\s/g, "");
    let captcha = sign_form_datas[2].value.replace(/\s/g, "");
    let hashkey = $('#captcha_hashkey').val();

    if (!username) {
        layer.msg('请输入用户名！', {
            icon: 2,
            time: 1500
        });
    } else if (!password) {
        layer.msg('请输入密码!', {
            icon: 2,
            time: 1500
        });
    } else if (!captcha) {
        layer.msg('请输入验证码!', {
            icon: 2,
            time: 1500
        });
    } else {
        $.ajax({
            url: sign_url,
            type: "POST",
            dataType: "json",
            data: {
                sign_datas: JSON.stringify(sign_form_datas),
                "hashkey": hashkey,
            },
            //async: false,
            success: function(result) {
                if (result.code == '1') {
                    layer.msg(result.message, {
                        time: 800
                    }, function() {
                        window.location.href = homepage_url;
                    });
                } else {
                    layer.msg(result.message, {
                        icon: 2,
                        time: 1000
                    }, function() {
                        update_captcha();
                    });
                }
            },
            error: function(XMLHttpRequest, textStatus, errorThrown) {
                alert('错误信息：' + XMLHttpRequest.responseText); //获取的信息即是异常中的Message
            }
        });
    }
}

function sign_up() {
    let register_form_datas = $('#sign_up').serializeArray();
    let username = register_form_datas[0].value.replace(/\s/g, "");
    let password = register_form_datas[1].value.replace(/\s/g, "");
    let repassword = register_form_datas[2].value.replace(/\s/g, "");
    let captcha = register_form_datas[3].value.replace(/\s/g, "");
    let hashkey = $('#captcha_hashkey').val();
    let protocol = $('#protocol').is(':checked');

    let check_username = /^[a-zA-Z][a-zA-Z0-9_]{4,15}$/; // 4-15位数字字母下划线
    let checkpass = /^[\w_-]{6,16}$/; // 至少6位，字母数字下划线和减号

    if (!username) {
        layer.msg('用户名不能为空！', {
            icon: 2,
            time: 1500
        });
    } else if (!check_username.test(username)) {
        layer.msg('用户名不符合要求！', {
            icon: 2,
            time: 1500
        });
    } else if (!password) {
        layer.msg('密码不能为空！', {
            icon: 2,
            time: 1500
        });
    } else if (!checkpass.test(password)) {
        layer.msg('密码不符合要求！', {
            icon: 2,
            time: 1500
        });
    } else if (password != repassword) {
        layer.msg('两次密码不一致！', {
            icon: 2,
            time: 1500
        });
    } else if (!captcha) {
        layer.msg('请填写验证码！', {
            icon: 2,
            time: 1500
        });
    } else if (!protocol) {
        layer.msg('请先阅读并同意相关协议！', {
            icon: 2,
            time: 1500
        });
    } else {
        $.ajax({
            url: register_url,
            type: "POST",
            dataType: "json",
            data: {
                register_datas: JSON.stringify(register_form_datas),
                'hashkey': hashkey,
            },
            //async: false,
            success: function(result) {
                if (result.code == '1') {
                    layer.msg(result.message, {
                        time: 800
                    }, function() {
                        $('#return_sing_in').click();
                        update_captcha();
                    });
                } else {
                    layer.msg(result.message, {
                        icon: 2,
                        time: 1000
                    }, function() {
                        update_captcha();
                    });
                }
            },
            error: function(XMLHttpRequest, textStatus, errorThrown) {
                alert('错误信息：' + XMLHttpRequest.responseText); //获取的信息即是异常中的Message
            }
        });
    }
}